<!doctype html>
<html lang="" class="dark">
    <head>
        <meta charset="UTF-8" />
        <link rel="icon" href="/favicon.ico" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>萧然清绿 • 云上智管</title>
        <!-- 字体资源导入 -->
        <link rel="stylesheet" href="./fonts/Oswald-Regular-font.css" />
        <link rel="stylesheet" href="./fonts/pangmen-font.css" />
        <link rel="stylesheet" href="./fonts/YouSheBiaoTiHei.css" />
        <link rel="stylesheet" href="./theme/index.css" />
        <!-- 地图样式 -->
        <link rel="stylesheet" href="./lib/mapbox/mapbox-gl.css" />
        <!-- 第三方-js导入 -->
        <script src="./lib/mapbox/mapbox-gl.js"></script>
        <script src="./lib/mapbox/mapbox-wind.js"></script>
        <script src="./lib/echarts/echarts.js"></script>
        <script src="./lib/turf/turf.min.js"></script>
        <!-- 进场动画 -->
        <style>
            .entry-page-loading {
                position: fixed;
                left: 0;
                width: 100%;
                height: 100%;
                top: 0;
                background-color: rgb(24.4, 33.8, 43.5);
                z-index: 10000;
                display: flex;
                justify-content: center;
                align-items: center;
            }
            .entry-page-loading-style {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 16px;
            }
            .entry-page-loading-style .entry-page-icon {
                width: 48px;
                height: 48px;
                animation: entry-page-loading-icon-rotate 1s linear infinite;
            }
            .entry-page-loading-style .entry-page-icon .icon {
                width: 100%;
                height: 100%;
            }
            .entry-page-loading-style .entry-page-loading-text {
                color: #00aef6;
                font-size: 24px;
            }
            @keyframes entry-page-loading-icon-rotate {
                0% {
                    transform: rotate(0);
                }
                25% {
                    transform: rotate(90deg);
                }
                50% {
                    transform: rotate(180deg);
                }
                75% {
                    transform: rotate(270deg);
                }
                100% {
                    transform: rotate(360deg);
                }
            }
        </style>
    </head>
    <body>
        <div class="entry-page-loading">
            <div class="entry-page-loading-style">
                <span class="entry-page-icon">
                    <svg
                        t="1747189573208"
                        class="icon"
                        viewBox="0 0 1024 1024"
                        version="1.1"
                        xmlns="http://www.w3.org/2000/svg"
                        p-id="1543"
                        width="256"
                        height="256"
                    >
                        <path
                            d="M512 170.666667C323.477333 170.666667 170.666667 323.477333 170.666667 512s152.810667 341.333333 341.333333 341.333333 341.333333-152.810667 341.333333-341.333333h85.333334c0 235.648-191.018667 426.666667-426.666667 426.666667S85.333333 747.648 85.333333 512 276.352 85.333333 512 85.333333v85.333334z"
                            p-id="1544"
                            fill="#00aef6"
                        ></path>
                    </svg>
                </span>
                <span class="entry-page-loading-text">加载中。。。</span>
            </div>
        </div>
        <div id="fpi-app"></div>
        <script type="module" src="/src/main.ts"></script>
    </body>
</html>
